Hum I am not an expert in tabIndex so I can't think about other side effect
any opinion @artemjackson?

Could you move the close icon please? I will try after that :)

@pradel all set, just moved it and it's working great for me. I'm able to tab to X after tabbing through form content.

@pradel @peterlazzarino
I would recommend to wrap SVG with an button, cuz button catches "Tab"-ing by default and emits click event on space or enter hit.

@artemjackson we should definitely wrap it with a button will be easier you are right. @peterlazzarino does that looks good to you?

@pradel I was playing around with this yesterday however that button would have to be the one that is styled absolute, top, right, etc instead of the SVG. The closeIcon class would no longer behave as it does now resulting in some potentially breaking changes for consumers. This is also complicated by the SVG size prop that is passed in to the component.

I was thinking a good solution to keep as much backwards compatibility as possible would be to wrap the SVG with a button that has a tabIndex and a new closeButton class style that has the absolute positioning. The user could override the closeIcon and style it like they can now and also still pass the height and width for the SVG but to move it around they'd have to style the button.

What do you think?

@peterlazzarino would be great to keep backward compatibility if possible
Your solution seems like a good one :)

@peterlazzarino does that looks good to you?
I will also fix other bugs and release as a major version 3.0.0 since this can be a breaking change for some users